<template>
  <a-popover position="bottom">
    <template #content>
      <p v-for="(prop, k) in purchaseSpecsArr" :key="k">
        <span>{{ prop.name }}：</span>
        <span>{{ getStrVal(prop.purchaseValue) }}</span>
      </p>
    </template>
    <div>
      <p v-for="(prop, k) in purchaseSpecsArr.slice(0, 3)" :key="k">
        <span>{{ prop.name }}：</span>
        <span>{{ getStrVal(prop.purchaseValue) }}</span>
      </p>
    </div>
  </a-popover>
</template>

<script lang="ts" setup>
  import { PropType } from 'vue'
  import { getStrVal } from '@/utils'
  const props = defineProps({
    purchaseSpecsArr: {
      type: Array as PropType<Array<any>>,
      default: () => [],
    },
  })
</script>

<style lang="less" scoped></style>
